<template>
	<h3>排课表</h3>
	<hr>
	<div style="display: flex;justify-content: space-between;">
		<div style="width:70%;border: 1px solid blue;">
			<h3>已有的教学安排</h3>
			<table border="1" style="width: 95%;">
				<tr v-for="(x,idx) in tasks">
					<td>{{x.user.uid}}</td>
					<td>{{x.user.uname}}</td>
					<td>{{x.clz.clzno}}</td>
					<td>{{x.clz.clzname}}</td>
					<td>{{x.course.cno}}</td>
					<td>{{x.course.cname}}</td>
					<td><button @click="del(x.kid)">删除</button></td>
				</tr>
			</table>
		</div>
		<div style="width: 30%; border: 1px solid blue;">
			教师:<select v-model="task.user.uid">
				<option v-for="(x,idx) in teas" v-bind:text="x.uname" v-bind:value="x.uid">
					{{x.uname}}
				</option>
			</select>
			<hr>
			班级:<select v-model="task.clz.clzno">
				<option v-for="(x,idx) in clzs" v-bind:text="x.clzname" v-bind:value="x.clzno">
					{{x.clzname}}
				</option>
			</select>
			<hr>
			课程:<select v-model="task.course.cno">
				<option v-for="(x,idx) in cours" v-bind:text="x.cname" v-bind:value="x.cno">
					{{x.cname}}
				</option>
			</select>
			<hr>
			<button @click="add()">添加</button>
		</div>
	</div>
</template>

<script>
	export default{
		data(){
			return{
				tasks:[],
				task:{kid:0,user:{uid:0},clz:{clzno:''},course:{cno:''}},
				teas:[],
				cours:[],
				clzs:[],
				token:'',
			}
		},
		methods:{
			add(){
				const headers1 = {  //定义请求头
					'Authorization':'Bearer '+ this.token
				};
				
				console.log(this.task)
				this.$postx("/api/adm/task/add",this.task)
				.then((resp)=>{
					console.log("true")
					console.log(resp.data.data)
					this.tasks = resp.data.data
				})
			},
			del(id){
				console.log(id);
				this.$get(this.$ip+"/api/adm/task/del/"+id)
				.then((resp)=>{
					console.log(resp.data.data)
					this.tasks = resp.data.data
				})
			}
			
			
		},
		
		mounted() {
			this.token = window.localStorage.getItem("token");
			console.log("this.token==")
			console.log(this.token)
			this.$get("/api/adm/task/findAll")
			.then((resp)=>{
				console.log("task==")
				console.log(resp.data.data) //排课表
				this.tasks = resp.data.data
			})
			
			this.$get("/api/adm/clz/findAll")
			.then((resp)=>{
				console.log(resp.data.data) //班级列表
				this.clzs = resp.data.data
			});
			this.$get("/api/adm/course/findAll")
			.then((resp)=>{
				console.log(resp.data.data) //课程列表
				this.cours = resp.data.data
			});
			this.$get("/api/adm/tea/findAll")
			.then((resp)=>{
				console.log(resp.data.data)
				this.teas = resp.data.data;
			})
		}
	}
</script>

<style>
</style>
